@charset "utf-8";
@import "config";

.synopsis_data {
    font-size: 0.6rem;
    line-height: 1.3em;
    text-align: center;
    background-color: #4a5fbe;
    background: -webkit-radial-gradient(bottom center, ellipse, #a8a6e1, #4a5fbe);
    background: radial-gradient(bottom center, ellipse, #a8a6e1, #4a5fbe);

    a {
        color: #ffffff;
    }

    .emphasize {
        display: block;
        padding: setLengthByHeight(52px) 0;

        > * {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            padding: 0 setLengthByHeight(20px);
        }

        span {
            display: block;
            font-size: 1.1rem;
            line-height: 1.3em;
        }
    }

    .other {
        overflow: hidden;

        .item {
            float: left;
            width: 33.1%;
            background-color: rgba(0, 0, 0, 0.1);
            padding: setLengthByHeight(20px);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            &:not(:nth-child(3n)) {
                margin-right: 0.35%;
            }

            span {
                position: relative;
            }

            em.new {
                &::after {
                    font-size: 0;
                    content: "";
                    position: absolute;
                    right: - setLengthByHeight(15px);
                    top: - setLengthByHeight(5px);
                    width: setLengthByHeight(20px);
                    height: setLengthByHeight(20px);
                    border-radius: 50%;
                    background-color: themeColor();
                    border: 1px solid #ffffff;
                    -webkit-transform: scale(0.5);
                    -webkit-transform-origin: top right;
                    transform: scale(0.5);
                    transform-origin: top right;
                }
            }

            p {
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
        }
    }
}

.add_goods {
    padding: setLengthByHeight(20px);

    a {
        font-size: 0;
        display: block;
        padding: 0 0.5rem;

        * {
            vertical-align: middle;
        }

        .iconfont {
            font-size: 1rem;
        }

        span {
            font-size: 0.75rem;
            margin-left: setLengthByHeight(12px);
        }
    }
}

.function {
    font-size: 0.6rem;
    overflow: hidden;
    background-color: #eeeeee;
    border-top: 1px solid #e3e3e3;

    .item {
        -webkit-tap-highlight-color: lightgray(0.3);
        float: left;
        width: 33.1%;
        text-align: center;
        background-color: #ffffff;
        position: relative;
        padding: setLengthByHeight(50px) setLengthByHeight(20px);
        &:not(:nth-child(3n)) {
            margin-right: 0.35%;
        }
        &:not(:nth-child(-n+3)) {
            margin-top: 0.35%;
        }

        div {
            width: setLengthByHeight(90px);
            height: setLengthByHeight(90px);
            overflow: hidden;
            margin: auto;

            img {
                display: block;
                margin: auto;
                height: 100%;
            }
        }

        span {
            height: 0.8rem;
            line-height: 0.8rem;
            position: absolute;
            top: setLengthByHeight(20px);
            right: 50%;
            margin-right: - setLengthByHeight(80px);
            color: #ffffff;
            background-color: themeColor();
            border-radius: setLengthByHeight(5px);
            padding: 0 0.3em;
            min-width: 1.5em;
            max-width: 2.6em;

            &::after {
                content: "";
                position: absolute;
                left: 20%;
                bottom: - setLengthByHeight(10px);
                border-top: setLengthByHeight(11px) solid themeColor();
                border-left: setLengthByHeight(2px) solid transparent;
                border-right: setLengthByHeight(10px) solid transparent;
            }

            em {
                display: block;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
        }

        p {
            color: lightgray();
            margin-top: setLengthByHeight(32px);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    }
}

.layer {
    .dialog {
        .icon_list {
            .item {
                .icon-weixin {
                    background-color: #85d16d;
                }

                .icon-pengyouquan {
                    background-color: #6dd193;
                }

                .icon-weibo {
                    background-color: #f26868;
                }

                .icon-QQ {
                    background-color: #4c88f5;
                }

                .icon-qqkongjian {
                    background-color: #f0c759;
                }

                .icon-shouji {
                    background-color: #54d3b1;
                }

                .icon-liuyan1 {
                    background-color: #ff936d;
                }

                .icon-erweima {
                    color: #000000;
                    border: setLengthByHeight(4px) solid #dde0de;
                    background-color: #ffffff;
                }

                .icon-fuzhilianjie {
                    background-color: #a8bcc8;
                }

                .icon-shichang {
                    background-color: #82cf4f;
                }
            }
        }
    }
}
